.cf-alert{
    -fx-padding: 8px 10px;
    -fx-background-color: derive(-cf-primary-color,90%);
    -fx-background-radius:3px;
}
.cf-alert > .container{
    -fx-spacing: 10px;
    -fx-alignment:center-left;
}
.cf-alert > .container > .text-label{
    -fx-graphic-text-gap: 10px;
    -fx-text-fill: -cf-primary-color;
    -fx-font-size: 14px;
}
.cf-alert > .container > .text-label  > .ikonli-font-icon{
    -fx-icon-color: -cf-primary-color;
    -fx-icon-size: 16px;
}
.cf-alert.success > .container > .text-label  > .ikonli-font-icon{-fx-icon-color: -cf-success-color;}
.cf-alert.info > .container > .text-label  > .ikonli-font-icon{-fx-icon-color: -cf-info-color;}
.cf-alert.warn > .container > .text-label  > .ikonli-font-icon{-fx-icon-color: -cf-warn-color;}
.cf-alert.danger > .container > .text-label  > .ikonli-font-icon{-fx-icon-color: -cf-danger-color;}

.cf-alert.success{-fx-background-color: derive(-cf-success-color,90%);}
.cf-alert.info{-fx-background-color: derive(-cf-info-color,90%);}
.cf-alert.warn{-fx-background-color: derive(-cf-warn-color,90%);}
.cf-alert.danger{-fx-background-color: derive(-cf-danger-color,90%);}

.cf-alert > .container > .close-icon{
    -fx-cursor:hand;
}
.cf-alert > .container > .close-icon{
    -fx-icon-size: 12px;
    -fx-icon-color: -cf-text-color;
}